<!--
 * @Author: jingjingzheng 1742420988@qq.com
 * @Date: 2024-06-27 13:10:43
 * @LastEditors: jingjingzheng 1742420988@qq.com
 * @LastEditTime: 2024-06-30 20:02:29
 * @FilePath: \greencityldzb_ui\src\table\DatavTable.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
    <div id="DatavTable" title="城市绿道服务半径覆盖率">
        <dv-scroll-board :config="config" style="width:100%;height:100%" />
    </div>
</template>

<script>
    export default {
        name: 'DatavTable',
        data() {
            return {
                // 配置
                config: {
                    // 标头
                    header: ['排名', '行政区划', '覆盖率'],
                    // 数据
                    data: [
                        ['1', '米东区', '79.51%'],
                        ['2', '高高新区', '79.36'],
                        ['3', '沙依巴克区', '76.1%'],
                        ['4', '水磨沟区', '78.47%'],
                        ['5', '经开区', '72.79%'],
                        ['6', '天山区', '72.1%'],
                    ],
                    // 是否开启序号
                    index: false,
                    // 宽度-按照顺序-不写就是平均分配
                    columnWidth: [100, 150, 200],
                    // 居中方式
                    align: ['center', 'center', 'center'],
                    // 滚动时间-每条
                    waitTime: 3500,
                    // 序号别名
                    indexHeader: 'ID'
                },
                // 定时器加载数据
                time: null,
                // datav数据刷新间隔
                datavNumber: 5,
                // datav下标
                datavIndex: 15,
                // 追加数据
                addlist: [],
                // 禁止鼠标悬浮暂停
                hoverPause: false
            }
        },
        mounted() {
        },
        methods: {
        },
        beforeDestroy() {
            // 在页面销毁后，清除计时器
            clearInterval(this.time)
        }
    }
</script>
<style scoped>
    #DatavTable {
        width: 100%;
        height: 100%;
    }
</style>
